<%@include file="/WEB-INF/common/taglibs.jsp"%>
<script type="text/javascript"
	src="${ctx}/resources/theme/supr/plugins/forms/togglebutton/jquery.toggle.buttons.js"></script>
<script type="text/javascript"
	src="${ctx}/resources/theme/supr/plugins/forms/dualselect/jquery.dualListBox-1.3.min.js"></script>
<script>
	$(document).ready(function() {

		$.configureBoxes();

	}

	);
</script> 



<script>
$(document).ready(function(){
	$("form.form-horizontal.seperator[method='post']").validate();
});
	
	
 </script>
<div class="row-fluid">

	<div class="span12">

		<div class="page-header">
			<h4>News Letter Group </h4>
		</div>

<form class="form-horizontal seperator" method="post">
<!--name --><div class="form-row row-fluid"><div class="span12"><div class="row-fluid"><label class="form-label span3" for="name">Name :</label><input class="span4" id="name" name="name"   type="text" value="${entity.name}" /></div></div></div>

<div class="form-row row-fluid">
							<div class="span12">
								<div class="leftBox">
									<div class="searchBox">
										<input type="text" id="box1Filter" class="searchField"
											placeholder="filter ..." />
										<button id="box1Clear" type="button" class="btn">
											<span class="icon12  icomoon-icon-cancel-circle"></span>
										</button>
									</div>
									<select id="box1View" multiple="multiple"
										class="multiple nostyle" style="height: 300px;">
										<c:forEach var="pend" items="${pending}">
											<option value="${pend.id}">${pend.surName} ${pend.givenName} ${pend.type} ${pend.email}</option>
										</c:forEach>
									</select> <br /> <span id="box1Counter" class="count"></span>

									<div class="dn">
										<select id="box1Storage" name="box1Storage" class="nostyle"></select>
									</div>
								</div>

								<div class="dualBtn">

									<button id="to2" type="button" class="btn">
										<span class="icon12 minia-icon-arrow-right-3"></span>
									</button>
									<button id="allTo2" type="button" class="btn">
										<span class="icon12 iconic-icon-last"></span>
									</button>
									<button id="to1" type="button" class="btn marginT5">
										<span class="icon12 minia-icon-arrow-left-3"></span>
									</button>
									<button id="allTo1" type="button" class="btn marginT5">
										<span class="icon12 iconic-icon-first"></span>
									</button>

								</div>

								<div class="rightBox">
									<div class="searchBox">
										<input type="text" id="box2Filter" class="searchField"
											placeholder="filter ..." />
										<button id="box2Clear" type="button" class="btn">
											<span class="icon12  icomoon-icon-cancel-circle"></span>
										</button>
									</div>
									<select id="box2View" multiple="multiple"
										class="multiple nostyle" style="height: 300px;" name="selectedIds">
										<c:forEach var="exist" items="${existing}">
											<option value="${exist.id}">${exist.surName} ${exist.givenName} ${exist.type} ${exist.email}</option>
										</c:forEach>


									</select> <br /> <span id="box2Counter" class="count"></span>

									<div class="dn">
										<select id="box2Storage" class="nostyle"></select>
									</div>
								</div>

							</div>
</div>



 <div class="form-row row-fluid">
				<div class="span12">
					<div class="row-fluid">
						<div class="form-actions">
							<div class="span3"></div>
							<div class="span4 controls">
								<button type="submit" class="btn btn-info marginR10">Save
									changes</button>
								<button class="btn btn-danger">Cancel</button>
							</div>
						</div>
					</div>
				</div>
			</div>
		</form>

	</div>
	<!-- End .span12 -->

</div>
<!-- End .row-fluid --> 

